<!DOCTYPE html>
 <html>
 <head>
     <title>动物世界</title>
     <style>
         body {
             background-color: #fffacd; /* 设置页面背景色为浅黄色 */
             text-align: center; /* 让内容居中显示 */
         }
         h1 {
             color: #4169e1; /* 设置标题颜色为蓝色 */
             font-size: 24px; /* 设置标题字体大小 */
         }
         hr {
             width: 50%; /* 设置水平分割线宽度为页面的50% */
             margin: 10px auto; /* 让水平分割线水平居中 */
         }
     </style>
 </head>
 <body>
     <h1>动物世界</h1>
     <hr>
     <img src="penguin.jpg" alt="企鹅" width="200" height="200"> <!-- 假设企鹅图片名为penguin.jpg -->
     <img src="deer.jpg" alt="鹿" width="200" height="200"> <!-- 假设鹿图片名为deer.jpg -->
 </body>
 </html><!DOCTYPE html>
 <html>
 <head>
     <title>动物世界</title>
     <style>
         body {
             background-color: #fffacd; /* 设置页面背景色为浅黄色 */
             text-align: center; /* 让内容居中显示 */
         }
         h1 {
             color: #4169e1; /* 设置标题颜色为蓝色 */
             font-size: 24px; /* 设置标题字体大小 */
         }
         hr {
             width: 50%; /* 设置水平分割线宽度为页面的50% */
             margin: 10px auto; /* 让水平分割线水平居中 */
         }
     </style>
 </head>
 <body>
     <h1>动物世界</h1>
     <hr>
     <img src="penguin.jpg" alt="企鹅" width="200" height="200"> <!-- 假设企鹅图片名为penguin.jpg -->
     <img src="deer.jpg" alt="鹿" width="200" height="200"> <!-- 假设鹿图片名为deer.jpg -->
 </body>
 </html>